﻿@using Personalblog.Utils
@using PersonalblogServices.Articels.Dto
@using Personalblog.Model.ViewModels
@using X.PagedList.Mvc.Core
@using X.PagedList.Web.Common
@model BlogListViewModel

<style type="text/css">
    .treeview .list-group-item {
        cursor: pointer
    }

    .treeview span.icon {
        width: 12px;
        margin-right: 5px
    }

    .treeview .node-disabled {
        color: silver;
        cursor: not-allowed
    }

    .node-categories {
    }

        .node-categories:not(.node-disabled):hover {
            background-color: #F5F5F5;
        }
</style>
@{
    <div class="container px-4 py-3">
        <div class="row">
            <!--这是文章列表-->
            <div class="col-lg-3 mb-3 treeview" id="categories">
                <ul class="list-group">
                    @foreach (var item in Model.Categories)
                    {
                        if(item.Visible){
                            <li class="list-group-item d-flex justify-content-between align-items-start node-categories">
                                <span id="@item.Id">
                                    <a href="/Blog/List?Categoryid=@item.Id" style="display:inline-block; color:inherit; text-decoration:none;width:200px">@item.Name</a>
                                </span>
                                <span class="ml-1 badge bg-primary rounded-pill">@item.Posts.Count().ToString()</span>
                            </li>
                        }
                    }
                </ul>
            </div>
            <div class="col-lg-9">
                @if (ViewBag.Categoryid != null)
                {
                    @if (ViewBag.Categoryid == Model.CurrentCategory.Id)
                    {
                        @foreach (var post in Model.Posts)
                        {
                            <partial name="BlogListArtice" model="post" />
                        }
                    }
                }
                else
                {
                    @foreach (var post in Model.Posts)
                    {
                        <partial name="BlogListArtice" model="post" />
                    }
                }
            </div>
        </div>
        <nav aria-label="Page navigation example">
            @Html.PagedListPager(Model.Posts, page => Url.Action(RazorHelper.GetCurrentActionName(ViewContext), new {page, categoryId = Model.CurrentCategoryId}),
        new PagedListRenderOptions {
        LiElementClasses = new[] {"page-item"},
        PageClasses = new[] {"page-link"},
        UlElementClasses = new[] {"pagination justify-content-center"}
        })
        </nav>
    </div>
}
@section bottom {
    <script src="~/lib/jquery/dist/jquery.min.js"></script>
    @* <script src="~/lib/bootstrap-treeview/dist/bootstrap-treeview.min.js"></script> *@
    <script src="/js/bootstrap-treeview.js"></script>
    <script src="/lib/boldList.js"></script>
}
